import { createRouter, createWebHistory } from "vue-router";
import Square from "../views/Square.vue";
import store from "../store/index";
import Contact from '../views/Contact.vue';
import Message from '../views/Message.vue';
import Meeting from '../views/Meeting.vue';
import User from '../views/User.vue';
import Search from '../views/Search.vue';
import Register from '../views/public/Register.vue';
import UserChat from '../views/chat/UserChat.vue';
import P2PVideo from '../views/chat/P2PVideo.vue';
import Empty from '../views/Empty.vue';
import Login from '../views/public/Login.vue';
import OthersInfo from '../views/info/OthersInfo.vue';
import OthersTempChatInfo from '../views/info/OthersTempChatInfo.vue';
import GroupInfo from '../views/info/GroupInfo.vue';
import PrivateInfo from '../views/info/PrivateInfo.vue';
import MyInfo from '../views/info/MyInfo.vue';
import NewFriend from '../views/contact/NewFriend.vue';
import Group from '../views/contact/Group.vue';
import AddContact from '../views/contact/AddContact.vue';
import MeetingDetail from '../views/meeting/MeetingDetail.vue';
import JoinMeeting from '../views/meeting/JoinMeeting.vue';
import OnMeeting from '../views/meeting/OnMeeting.vue';

const routes = [
  // 根目录重定向到广场
  {
    path: "/",
    redirect: "/square",
  },
  {
    path: "/square",
    name: "Square",
    // 路由非懒加载方式
    component: Square,
  },
  {
    path: "/contact",
    name: "Contact",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Contact,
  },
  {
    path: "/message",
    name: "Message",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Message,
  },
  {
    path: "/meeting",
    name: "Meeting",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Meeting,
  },
  {
    path: "/user",
    name: "User",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: User,
  },
  {
    path: "/chat/user-chat",
    name: "UserChat",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: UserChat,
  },
  {
    path: "/chat/p2p-video",
    name: "P2PVideo",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: P2PVideo,
  },
  {
    path: "/empty",
    name: "Empty",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Empty,
  },
  {
    path: "/public/login",
    name: "Login",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Login,
    meta: { redirectAlreadyLogin: true },
  },
  {
    path: "/public/register",
    name: "Register",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Register,
    meta: { redirectAlreadyLogin: true },
  },
  {
    path: "/info/others",
    name: "OthersInfo",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: OthersInfo,
  },
  {
    path: "/info/others/temp-chat",
    name: "OthersTempChatInfo",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: OthersTempChatInfo,
  },
  {
    path: "/info/private",
    name: "PrivateInfo",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: PrivateInfo,
  },
  {
    path: "/info/group",
    name: "GroupInfo",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: GroupInfo,
  },

  {
    path: "/info/my",
    name: "MyInfo",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: MyInfo,
  },

  {
    path: "/search",
    name: "Search",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Search,
  },
  {
    path: "/contact/new-friend",
    name: "NewFriend",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: NewFriend,
  },
  {
    path: "/contact/group",
    name: "Group",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: Group,
  },
  {
    path: "/contact/add",
    name: "AddContact",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: AddContact,
  },
  {
    path: "/meeting/detail",
    name: "MeetingDetail",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: MeetingDetail,
  },
  {
    path: "/meeting/join",
    name: "JoinMeeting",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.
    component: JoinMeeting,
  },
  {
    path: "/meeting/on",
    name: "OnMeeting",
    // 路由懒加载方式
    // which is lazy-loaded when the route is visited.() => import("../views/meeting/OnMeeting.vue")
    component: OnMeeting,
  },
];

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes,
});

// 添加路由守卫
// 全局前置守卫 按照创建顺序调用 守卫是异步执行的
router.beforeEach((to, from, next) => {
  // to 指的是我们即将要到达的路由
  // from 是指正在离开的路由
  //
  const { isLogin } = store.state;
  const { redirectAlreadyLogin } = to.meta; // 读取路由元信息
  if (!isLogin) {
    // 用户没有登录,清除缓存中的值
    store.commit("clear");
    // 如果要请求的页面是登录或注册页面，则直接到注册页面
    if (to.path == "/public/login" || to.path == "/public/register") {
      next();
    } else {
      // 跳转登录页面
      next("/public/login");
    }
  } else {
    // 如果已经登录，再次访问登录或注册页面，这接跳转到主页，否则跳转到具体的页面
    if (redirectAlreadyLogin) {
      next("/");
    } else {
      next();
    }
  }
});

export default router;
